@tailwind base;
@tailwind components;
@tailwind utilities;

/* 移动端全局适配样式 */
html {
  height: 100vh;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

body {
  height: 100vh;
  overflow: hidden;
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #f5f5f5;
}

#root {
  height: 100vh;
  overflow: hidden;
  position: relative;
}

/* 防止页面滚动 */
* {
  box-sizing: border-box;
}

/* 移动端点击优化 */
button, input, textarea, select {
  -webkit-appearance: none;
  border-radius: 0;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  border-radius: 25px;
  transition: all 0.3s;
  background-color: rgba(106, 115, 125, 0.2);
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(106, 115, 125, 0.27);
}

::-webkit-scrollbar-corner {
  display: none;
}

/* 移动端适配工具类 */
.mobile-container {
  height: 100vh;
  overflow: hidden;
  position: relative;
}

.mobile-scroll {
  height: calc(100vh - 1rem);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

/* 运势卡片页面滚动支持 */
.fortune-page {
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.fortune-page html,
.fortune-page body,
.fortune-page #root {
  overflow: auto !important;
}

.mobile-safe-area {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* 防止页面缩放 */
.mobile-no-zoom {
  touch-action: manipulation;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* TabBar 自定义样式 */
.adm-tab-bar {
  height: 0.4rem !important;
  font-size: 0.2rem !important;
  margin-bottom: 2.4rem !important;
}

.adm-tab-bar-item {
  font-size: 0.2rem !important;
  /* padding: 0.05rem 0 !important; */
}

.adm-tab-bar-item-icon {
  font-size: 0.22rem !important;
  /* margin-top: 0.32rem !important; */
  height: inherit;
}

.adm-tab-bar-item-title {
  font-size: 0.18rem !important;
  /* line-height: 3.2 !important; */
}

/* 天气信息展开动画 */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
    max-height: 0;
  }
  to {
    opacity: 1;
    transform: translateY(0);
    max-height: 500px;
  }
}

.slide-down-animation {
  animation: slideDown 0.3s ease-out;
  overflow: hidden;
}


